<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>SuKi 购物车</title>
<link href="css/daohangGW2.css" rel="stylesheet" type="text/css" />
<script src="js/gouwucheGW.js"></script>
<script src="js/daohangGW.js"></script>
<script src="js/jquery-2.1.4.min.js"></script>
 
</head>
<body>
<div id="div0">
	<div id="dlogo">	<!--放置logo和登陆注册-->
		<div>
        	<img src="images/logo.png" id="logo">
        </div>
	    <div id="dlzc">
	    	<span id="dlu"><a id="adl" href="RegLogin.html">登录 / 注册</a></span>
       		<div id="gwu" onClick="window.location.href='gouwuche.html'">
           		<div id="gshuliang">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;(<span id="numb">0</span>)
                </div>
        	</div>
	    </div>
	</div>
<!--导航栏-->
	<div id="divNav">
		<nav id="N">
	    	<div id="diva1" class="CSS" >
	        	<div id="divb1" class="b" onMouseOver="MyOver('divb1')" onMouseOut="MyOut('divb1')"><a href="index.html">首页</a></div>
	        </div>
	        <div id="diva2" class="CSS" >
	        	<div id="divb2" class="b" onMouseOver="MyOver('divb2'),SD()" onMouseOut="MyOut('divb2'),SD()">产品</div>
	        	<ul id="ul1" onMouseOver="MyOver('divb2'),SD()" onMouseOut="MyOut('divb2'),SD()">
	            	<li style="height:7px;"></li>		<!--空行，调整位置-->
	            	<li><a href="#" >佩戴</a></li>
	               	<li><a href="#" >家居</a></li>
	                <li><a href="#" >穿着</a></li>
	            </ul>
	        </div>
	        <div id="diva3" class="CSS" >
	        	<div id="divb3" class="b" onMouseOver="MyOver('divb3')" onMouseOut="MyOut('divb3')">新品</div>
	        </div>
	        <div id="diva4" class="CSS" >
	        	<div id="divb4" class="b" onMouseOver="MyOver('divb4')" onMouseOut="MyOut('divb4')">限时特卖</div>
	        </div>
	    </nav>
	</div>
</div>
<!--返回顶部-->
<div id="dyou" onClick="Top()"></div>
<!--以下是底部和内容-->
<div style="width:100%; position:relative; top:100px;">
<!--假设这是我们的填充-->
	<div style="width:100%; height:auto;">
    <div class="cart_main">  <!--购物车-->  
    
   		 <!-- 购物车导航栏-->  
	   <ul class="selected_item_tips">
	     <!-- 全选-->  
         <li class="all"> 
		    <div class="checkbox">
			   <input type="checkbox" id="top_all_select"/>
			</div>
            <span class="checkbox_tip">全选</span>
		 </li>
         
		 <li class="name">
		    商品名称
		 </li>
		 <li class="price">
		    商品价格
		 </li>
		 <li class="num">
		    数量
		 </li>
		 <li class="sum">
		    总计
		 </li>
		 <li class="op">
		    操作
		 </li>
	   </ul>
       
	<!-- 购物车导航栏结束-->  
    
    <!-- 购物车里的商品-->  
    
<div class="select_item_list">  <!-- 第一个商品-->  
		   
		<div class="select_item">
        		<!-- 选择商品-->  
                 <div class="checkbox select_input"> 
                             <input type="checkbox" class="store_glamever_product" />
                 </div>
				<img class="select_item_pic" src="images/poL (1).jpg"/><!-- 商品图片-->  
					  
				<div class="delete" onClick="Delete(0)"><!-- 删除购物车里的商品-->  
					   删除
                </div>

 				<div class="item_total_price"><!--商品总计价格 -->  
					     ￥<span class="shop-total-amount ShopTotal">0.00</span>
				</div>
                <!-- 商品数量操作-->  
                <div class="select_num_oper">
                     <button type="button" class="reduce">-</button> 
                     <input type="text" class="spec_num" value="1" /> 
                     <button type="button" class="add">+</button> 
                </div>
                <!-- 商品价格-->  
  				<div class="sale_unit_price">
					     ￥<span class="shop-total-amount GoodsPrice">68.00</span>
				</div>
                <!-- 商品简介-->  
				<div class="sale_intro">
					    <a class="select_item_name" >实木质便携口袋文艺A6笔记</a>
					    <div class="sale_spec_desc">本记事活页铁环黑胡桃小本子</div>
				</div>
		</div>
</div>
<!-- 一个商品结束-->  

<!-- 下面商品和上面一样-->  
<div class="select_item_list">  <!--第二个商品-->  
		   
		<div class="select_item">
        		<!-- 选择商品-->  
                 <div class="checkbox select_input"> 
                             <input type="checkbox" class="store_glamever_product" />
                 </div>
				<img class="select_item_pic" src="images/poG (2).jpg"/><!-- 商品图片-->  
					  
				<div class="delete" onClick="Delete(1)"><!-- 删除购物车里的商品-->  
					   删除
                </div>

 				<div class="item_total_price"><!--商品总计价格 -->  
					     ￥<span class="shop-total-amount ShopTotal">0.00</span>
				</div>
                <!-- 商品数量操作-->  
                <div class="select_num_oper">
                     <button type="button" class="reduce">-</button> 
                     <input type="text" class="spec_num" value="1" /> 
                     <button type="button" class="add">+</button> 
                </div>
                <!-- 商品价格-->  
  				<div class="sale_unit_price">
					     ￥<span class="shop-total-amount GoodsPrice">128.0</span>
				</div>
                <!-- 商品简介-->  
				<div class="sale_intro">
					    <a class="select_item_name" >小清新蓝色12寸挂钟表</a>
					    <div class="sale_spec_desc">现代简约日式实木静音客厅</div>
				</div>
		</div>
</div>
<!-- 一个商品结束-->  
<div class="select_item_list">  <!-- 第三个商品-->  
		   
		<div class="select_item">
        		<!-- 选择商品-->  
                 <div class="checkbox select_input"> 
                             <input type="checkbox" class="store_glamever_product" />
                 </div>
				<img class="select_item_pic" src="images/poJ (3).jpg"/><!-- 商品图片-->  
					  
				<div class="delete"  onClick="Delete(2)"><!-- 删除购物车里的商品-->  
					   删除
                </div>

 				<div class="item_total_price"><!--商品总计价格 -->  
					     ￥<span class="shop-total-amount ShopTotal">0.00</span>
				</div>
                <!-- 商品数量操作-->  
                <div class="select_num_oper">
                     <button type="button" class="reduce">-</button> 
                     <input type="text" class="spec_num" value="1" /> 
                     <button type="button" class="add">+</button> 
                </div>
                <!-- 商品价格-->  
  				<div class="sale_unit_price">
					     ￥<span class="shop-total-amount GoodsPrice">5360</span>
				</div>
                <!-- 商品简介-->  
				<div class="sale_intro">
					    <a class="select_item_name" >客厅办公室布艺两人沙发</a>
					    <div class="sale_spec_desc">菲碧的饼干沙发独立创意</div>
				</div>
		</div>
</div>
<!-- 一个商品结束-->  
<div class="select_item_list">  <!-- 第四个商品-->  
		   
		<div class="select_item">
        		<!-- 选择商品-->  
                 <div class="checkbox select_input"> 
                             <input type="checkbox" class="store_glamever_product" />
                 </div>
				<img class="select_item_pic" src="images/poD (14).jpg"/><!-- 商品图片-->  
					  
				<div class="delete"  onClick="Delete(3)"><!-- 删除购物车里的商品-->  
					   删除
                </div>

 				<div class="item_total_price"><!--商品总计价格 -->  
					     ￥<span class="shop-total-amount ShopTotal">0.00</span>
				</div>
                <!-- 商品数量操作-->  
                <div class="select_num_oper">
                     <button type="button" class="reduce">-</button> 
                     <input type="text" class="spec_num" value="1" /> 
                     <button type="button" class="add">+</button> 
                </div>
                <!-- 商品价格-->  
  				<div class="sale_unit_price">
					     ￥<span class="shop-total-amount GoodsPrice">128.0</span>
				</div>
                <!-- 商品简介-->  
				<div class="sale_intro">
					    <a class="select_item_name" >冰箱贴磁贴四件套</a>
					    <div class="sale_spec_desc">北欧极简几何分割实木</div>
				</div>
		</div>
</div>
<!-- 一个商品结束-->  
<div class="select_item_list">  <!-- 第五个商品-->  
		   
		<div class="select_item">
        		<!-- 选择商品-->  
                 <div class="checkbox select_input"> 
                             <input type="checkbox" class="store_glamever_product" />
                 </div>
				<img class="select_item_pic" src="images/poK (1).jpg"><!-- 商品图片-->  
					  
				<div class="delete"  onClick="Delete(4)"><!-- 删除购物车里的商品-->  
					   删除
                </div>

 				<div class="item_total_price"><!--商品总计价格 -->  
					     ￥<span class="shop-total-amount ShopTotal">0.00</span>
				</div>
                <!-- 商品数量操作-->  
                <div class="select_num_oper">
                     <button type="button" class="reduce">-</button> 
                     <input type="text" class="spec_num" value="1" /> 
                     <button type="button" class="add">+</button> 
                </div>
                <!-- 商品价格-->  
  				<div class="sale_unit_price">
					     ￥<span class="shop-total-amount GoodsPrice">5360</span>
				</div>
                <!-- 商品简介-->  
				<div class="sale_intro">
					    <a class="select_item_name" >小户型单人沙发椅</a>
					    <div class="sale_spec_desc">北欧懒人休闲扶手椅</div>
				</div>
		</div>
</div>
<!-- 一个商品结束-->  
<div class="select_item_list">  <!-- 第六个商品-->  
		   
		<div class="select_item">
        		<!-- 选择商品-->  
                 <div class="checkbox select_input"> 
                             <input type="checkbox" class="store_glamever_product" />
                 </div>
				<img class="select_item_pic" src="images/poE (6).jpg"/><!-- 商品图片-->  
					  
				<div class="delete" onClick="Delete(5)"><!-- 删除购物车里的商品-->  
					   删除
                </div>

 				<div class="item_total_price"><!--商品总计价格 -->  
					     ￥<span class="shop-total-amount ShopTotal">0.00</span>
				</div>
                <!-- 商品数量操作-->  
                <div class="select_num_oper">
                     <button type="button" class="reduce">-</button> 
                     <input type="text" class="spec_num" value="1" /> 
                     <button type="button" class="add">+</button> 
                </div>
                <!-- 商品价格-->  
  				<div class="sale_unit_price">
					     ￥<span class="shop-total-amount GoodsPrice">2519</span>
				</div>
                <!-- 商品简介-->  
				<div class="sale_intro">
					    <a class="select_item_name"> 沙发凳沙发床</a>
					    <div class="sale_spec_desc">创意沙发点亮空间</div>
				</div>
		</div>
</div>
<!-- 一个商品结束-->  
<div class="select_item_list">  <!-- 第七个商品-->  
		   
		<div class="select_item">
        		<!-- 选择商品-->  
                 <div class="checkbox select_input"> 
                             <input type="checkbox" class="store_glamever_product" />
                 </div>
				<img class="select_item_pic" src="images/poF (3).jpg"/><!-- 商品图片-->  
					  
				<div class="delete"  onClick="Delete(6)"><!-- 删除购物车里的商品-->  
					   删除
                </div>

 				<div class="item_total_price"><!--商品总计价格 -->  
					     ￥<span class="shop-total-amount ShopTotal">0.00</span>
				</div>
                <!-- 商品数量操作-->  
                <div class="select_num_oper">
                     <button type="button" class="reduce">-</button> 
                     <input type="text" class="spec_num" value="1" /> 
                     <button type="button" class="add">+</button> 
                </div>
                <!-- 商品价格-->  
  				<div class="sale_unit_price">
					     ￥<span class="shop-total-amount GoodsPrice">38.0</span>
				</div>
                <!-- 商品简介-->  
				<div class="sale_intro">
					    <a class="select_item_name" >实木杯垫杯子托</a>
					    <div class="sale_spec_desc">进口榉木整料创意礼物</div>
				</div>
		</div>
</div>
<!-- 一个商品结束-->  
<div class="select_item_list">  <!-- 第八个商品-->  
		   
		<div class="select_item">
        		<!-- 选择商品-->  
                 <div class="checkbox select_input"> 
                             <input type="checkbox" class="store_glamever_product" />
                 </div>
				<img class="select_item_pic" src="images/poA (1).jpg"/><!-- 商品图片-->  
					  
				<div class="delete"  onClick="Delete(7)"><!-- 删除购物车里的商品-->  
					   删除
                </div>

 				<div class="item_total_price"><!--商品总计价格 -->  
					     ￥<span class="shop-total-amount ShopTotal">0.00</span>
				</div>
                <!-- 商品数量操作-->  
                <div class="select_num_oper">
                     <button type="button" class="reduce">-</button> 
                     <input type="text" class="spec_num" value="1" /> 
                     <button type="button" class="add">+</button> 
                </div>
                <!-- 商品价格-->  
  				<div class="sale_unit_price">
					     ￥<span class="shop-total-amount GoodsPrice">298.0</span>
				</div>
                <!-- 商品简介-->  
				<div class="sale_intro">
					    <a class="select_item_name" >实木砧板长方形</a>
					    <div class="sale_spec_desc">全手工打磨，质感丰富</div>
				</div>
		</div>
</div>
<!-- 一个商品结束-->  
<div class="select_item_list">  <!-- 第九个商品-->  
		   
		<div class="select_item">
        		<!-- 选择商品-->  
                 <div class="checkbox select_input"> 
                             <input type="checkbox" class="store_glamever_product" />
                 </div>
				<img class="select_item_pic" src="images/poC (2).jpg"/><!-- 商品图片-->  
					  
				<div class="delete"  onClick="Delete(8)"><!-- 删除购物车里的商品-->  
					   删除
                </div>

 				<div class="item_total_price"><!--商品总计价格 -->  
					     ￥<span class="shop-total-amount ShopTotal">0.00</span>
				</div>
                <!-- 商品数量操作-->  
                <div class="select_num_oper">
                     <button type="button" class="reduce">-</button> 
                     <input type="text" class="spec_num" value="1" /> 
                     <button type="button" class="add">+</button> 
                </div>
                <!-- 商品价格-->  
  				<div class="sale_unit_price">
					     ￥<span class="shop-total-amount GoodsPrice">1280</span>
				</div>
                <!-- 商品简介-->  
				<div class="sale_intro">
					    <a class="select_item_name" >创意北欧极简沙发</a>
					    <div class="sale_spec_desc">创意北欧极简沙发设计</div>
				</div>
		</div>
</div>
<!-- 一个商品结束-->  
<div class="select_item_list">  <!-- 第十个商品-->  
		   
		<div class="select_item">
        		<!-- 选择商品-->  
                 <div class="checkbox select_input"> 
                             <input type="checkbox" class="store_glamever_product" />
                 </div>
				<img class="select_item_pic" src="images/poI (1).jpg"/><!-- 商品图片-->  
					  
				<div class="delete"  onClick="Delete(9)"><!-- 删除购物车里的商品-->  
					   删除
                </div>

 				<div class="item_total_price"><!--商品总计价格 -->  
					     ￥<span class="shop-total-amount ShopTotal">0.00</span>
				</div>
                <!-- 商品数量操作-->  
                <div class="select_num_oper">
                     <button type="button" class="reduce">-</button> 
                     <input type="text" class="spec_num" value="1" /> 
                     <button type="button" class="add">+</button> 
                </div>
                <!-- 商品价格-->  
  				<div class="sale_unit_price">
					     ￥<span class="shop-total-amount GoodsPrice">188.0</span>
				</div>
                <!-- 商品简介-->  
				<div class="sale_intro">
					    <a class="select_item_name" >性冷淡简约风全棉四件套</a>
					    <div class="sale_spec_desc">单床笠款男士床品</div>
				</div>
		</div>
</div>
<!-- 一个商品结束-->  
<div class="select_item_list">  <!-- 第11个商品-->  
		   
		<div class="select_item">
        		<!-- 选择商品-->  
                 <div class="checkbox select_input"> 
                             <input type="checkbox" class="store_glamever_product" />
                 </div>
				<img class="select_item_pic" src="images/poH (1).jpg"/><!-- 商品图片-->  
					  
				<div class="delete"  onClick="Delete(10)"><!-- 删除购物车里的商品-->  
					   删除
                </div>

 				<div class="item_total_price"><!--商品总计价格 -->  
					     ￥<span class="shop-total-amount ShopTotal">0.00</span>
				</div>
                <!-- 商品数量操作-->  
                <div class="select_num_oper">
                     <button type="button" class="reduce">-</button> 
                     <input type="text" class="spec_num" value="1" /> 
                     <button type="button" class="add">+</button> 
                </div>
                <!-- 商品价格-->  
  				<div class="sale_unit_price">
					     ￥<span class="shop-total-amount GoodsPrice">138.0</span>
				</div>
                <!-- 商品简介-->  
				<div class="sale_intro">
					    <a class="select_item_name" >亚伯拉罕冰湖装饰画</a>
					    <div class="sale_spec_desc">创意北欧极简沙发设计</div>
				</div>
		</div>
</div>
<!-- 一个商品结束-->  
<div class="select_item_list">  <!-- 第12个商品-->  
		   
		<div class="select_item">
        		<!-- 选择商品-->  
                 <div class="checkbox select_input"> 
                             <input type="checkbox" class="store_glamever_product" />
                 </div>
				<img class="select_item_pic" src="images/poB (1).jpg"/><!-- 商品图片-->  
					  
				<div class="delete"  onClick="Delete(11)"><!-- 删除购物车里的商品-->  
					   删除
                </div>

 				<div class="item_total_price"><!--商品总计价格 -->  
					     ￥<span class="shop-total-amount ShopTotal">0.00</span>
				</div>
                <!-- 商品数量操作-->  
                <div class="select_num_oper">
                     <button type="button" class="reduce">-</button> 
                     <input type="text" class="spec_num" value="1" /> 
                     <button type="button" class="add">+</button> 
                </div>
                <!-- 商品价格-->  
  				<div class="sale_unit_price">
					     ￥<span class="shop-total-amount GoodsPrice">1280</span>
				</div>
                <!-- 商品简介-->  
				<div class="sale_intro">
					    <a class="select_item_name" >云朵的旅程沙发明创意沙发</a>
					    <div class="sale_spec_desc">发设计师家具北欧风可定制</div>
				</div>
		</div>
</div>
<!-- 一个商品结束-->  


<!--购物车里面的商品结束-->

<!--购物车尾部-->
 	 <div class="selected_items_result">
	     <div class="result_part1">商品金额：<span id="selected_item_total_price">¥0.00</span></div>
	     <div class="two_clearing_btn btn_disabled" id="two_clearing_btn" onClick="window.location.href='shopNow.html'">立即结算</div>
	     <div id="continue_buy"><a class="continue_buy" onclick="window.location='index.html'"><&nbsp;继续购物</a></div>
	 </div>
	   
 </div>
   
</div>

<!--这是网页底部-->
	<div id="btm">
		<div id="Dul">
        	<ul id="ul0">
            	<li id="li1">关于我们</li>
                <li style="height:18px;"></li>
           	 	<li><a href="">企业介绍</a></li>
            	<li><a href="">人才招聘</a></li>
            	<li><a href="">隐私政策</a></li>
            </ul>
            <ul>
            	<li id="li1">售后服务</li>
                <li style="height:18px;"></li>
                <li><a href="">退货声明</a></li>
            </ul>
      		<ul id="ul1">
       			<li id="li1">帮助信息</li>
                <li style="height:18px;"></li>
            	<li><a href="">常见问题</a></li>
            	<li><a href="">联系客服</a></li>
        	</ul>
        </div>
        <div id="dd">
        	@马婷婷，朱子荟，李圣威，林铭欣，钟世杰，谢芝勇，谢舒珂共同制作。
        </div>
	</div>
</div>
<script>
 // 数量减 
 $(".reduce").click(function() { 
 var t = $(this).parent().find('.spec_num'); //获取匹配元素后代元素
 t.val(parseInt(t.val()) - 1); 
 if (t.val() <= 1) { 
  t.val(1); 
 } 
 TotalPrice(); 
 }); 
 // 数量加 
 $(".add").click(function() { 
 var t = $(this).parent().find('.spec_num'); 
 t.val(parseInt(t.val()) + 1); 
 if (t.val() <= 1) { 
  t.val(1); 
 } 
 TotalPrice(); 
 }); 
 // 点击商品按钮
 $(".store_glamever_product").click(function() { 
 var goods = $(this).find(".store_glamever_product"); //获取所有商品 
 var goodsC = $(this).find(".store_glamever_product:checked"); //获取所有被选中的商品 
 var Shops = $(this).find("#top_all_select"); //获取全选按钮 
 if (goods.length == goodsC.length) { //如果选中的商品等于所有商品 
  Shops.prop('checked', true); //全选按钮被选中
  TotalPrice(); 
   
} else { //如果选中的商品不等于所有商品 
  $("#top_all_select").prop('checked', false); //全选按钮也不被选中 
  // 计算 
  TotalPrice(); 
  // 计算 
 } 
 }); 
 $(".delete").click(function(){ //删除商品
    $(this).parent().remove();
	TotalPrice(); 
	numb=document.getElementById("numb");
	ls=window.localStorage.length;
	numb.innerHTML = ls; 
});

 // 点击全选按钮 
 $("#top_all_select").click(function() { 
 if ($(this).prop("checked") == true) { //如果全选按钮被选中 
  $(".store_glamever_product").prop('checked', true); //所有按钮都被选中 
  TotalPrice(); 
 } else { 
  $(".store_glamever_product").prop('checked', false); //else所有按钮不全选 
  TotalPrice(); 
 }  
 }); 
 
 function TotalPrice() { 
 var allprice = 0; //all总价 
 $(".select_item").each(function() { //循环每个商品 
  var oprice = 0; //店铺总价  商品总价
  $(this).find(".store_glamever_product").each(function() { //循环店铺里面的商品 
  if ($(this).is(":checked")) { //如果该商品被选中 
   var num = parseInt($(this).parents(".select_item").find(".spec_num").val()); //得到商品的数量 
   var price = parseFloat($(this).parents(".select_item").find(".GoodsPrice").text()); //得到商品的单价 
   var total = price * num; //计算单个商品的总价 
   oprice += total; //计算该店铺的总价 
  }
  $(this).closest(".select_item").find(".ShopTotal").text(oprice.toFixed(2)); //显示被选中商品的店铺总价 
  }); 
  var oneprice = parseFloat($(this).find(".ShopTotal").text()); //得到每个店铺的总价 
  allprice += oneprice; //计算所有店铺的总价 
 }); 
 $("#selected_item_total_price").text("￥"+allprice.toFixed(2)); //输出全部总价 
 } 
</script>
<script>
	var a = document.getElementById('dlu');
	var user = localStorage.getItem("user");
	if(user!=null){
		a.innerHTML = '<span><a href="RegLogin.html" style="color:#aac4bc">'+user+'</a></span>';
	}
</script>

</body>
</html>
